<template>
  <div id="app" ref="divapp">
    <h2>测试题</h2>
    <Subject
      v-for="(item, i) in arr"
      :key="i"
      :sumA="(sumA = item)"
      :sumB="(sumB = arr2[i])"
      :index="i"
      @event-name="SubjectEnt"
    ></Subject>
    <div>
      <Flag v-for="(item, index) in arr" :key="index" :index="index" :flagArr="flagArr"></Flag>
    </div>
  </div>
</template>

<script>
import Flag from '@/components/Day/Day3/count/Flag.vue'
import Subject from '@/components/Day/Day3/count/Subject.vue'
const body = document.body
export default {
  components: {
    Flag,
    Subject
  },
  data() {
    return {
      sumA: 0,
      sumB: 0,
      arr: [],
      arr2: [],
      flagArr: '',
      body: body
    }
  },
  mounted() {
    const fas = this
    function fns() {
      for (var i = 1; i < 7; i++) {
        fas.arr.push(parseInt(Math.random() * (10 - 1) + 1))
        fas.arr2.push(parseInt(Math.random() * (10 - 1) + 1))
      }
    }
    fns()
    this.$refs.divapp.addEventListener('click', e => {
      e.preventDefault()
      fas.arr = []
      fas.arr2 = []
      fns()
    })
    // this.body.addEventListener('click', e => {
    //   e.preventDefault()
    //   fas.arr = []
    //   fas.arr2 = []
    //   fns()
    // })
  },
  methods: {
    SubjectEnt(obj) {
      this.flagArr = obj
    }
  }
}
</script>
<style lang="less" scoped></style>
